<template>
    <div class="newsInfo-container">
         <h3 class="newsInfo-title">{{newsinfo.title}}</h3>
          <div class="newsinfo-subTitle">
              <span>发布时间：{{newsinfo.add_time}}</span>
              <span>点击：{{newsinfo.click}}</span>
          </div>   
          <hr>    
         <div class="newsContent" v-html="newsinfo.content"></div>

         <comment-box></comment-box>
    </div>



</template>

<script>
import {Toast} from  'mint-ui'

// 引用评论子组件
import comment from '../subcomponent/comment.vue'

export default {
    data(){
        return{
            id:this.$route.params.id,
            newsinfo:{}
        }
    },
    created(){
       this.getNewsInfo()
    },
    methods:{
        getNewsInfo(){
            this.$http.get('api/getnew/'+this.id).then(
                result =>{
                    if(result.body.status == 0){ //请求成功
                          this.newsinfo =  result.body.message[0]
                    }
                    else{
                          Toast('加载新闻失败..')
                    }
                }
            )
        }
    },
    components:{
        "comment-box":comment
    }

}
</script>

<style lang="scss">
.newsInfo-container{
    padding:0 5px;
}
.newsInfo-container .newsInfo-title{
    font-size:16px;
    margin:15px 0;
    color:red;
    text-align: center;
}

.newsInfo-container  .newsinfo-subTitle{
    font-size:15px;
    color:darkviolet;
    display: flex;
    justify-content: space-between;
}
</style>